import React, { useState } from 'react';
import { Modal, Button } from 'antd';
import '../deviceManege/ModalC.less'

function ModalC() {
    const a={textAlign: 'center',
            fontSize: '17px'}
    const [isModalVisible, setIsModalVisible] = useState(false);
    
    const showModal = () => {
      setIsModalVisible(true);
    };
  
    const handleOk = () => {
      setIsModalVisible(false);
    };
  
    const handleCancel = () => {
      setIsModalVisible(false);
    };
  
    return (
      <div className="modalc">
        { <a  onClick={showModal}>
        删除
        </a> }
        <Modal centered={true} title="删除" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel} footer={<Button id="footbtn" onClick={handleCancel}>返回</Button>}  destroyOnClose={true}
         footer={[
            <Button id="btn1">确认</Button>,
            <Button id="btn2" onClick={handleCancel}>取消</Button>
        ]} 
        >
             <div id="d1" style={a}>确定将该设备删除？</div>
             <div id="d2">删除后包含该设备的内容将无法显示</div>
        </Modal>
    </div>
  );
};

export default ModalC